<template>
	<view class="innerContain">
		<view class="top-content"><view class></view></view>
		<view class="topradio">
			<view class="top">
				<table
					border="1"
					width="100%"
					cellspacing="0"
					cellpadding="0"
					style="table-layout: fixed;border-collapse: collapse;"
				>
					<tr class="titleTd">
						<td class="tdback">客户名称</td>
						<td class="tdback">项目名称</td>
						<td class="tdback">合同号</td>
						<td class="tdback">产品代码</td>
						<td class="tdback">处理次数</td>
						<td class="tdback" style="padding: 0;width:500rpx;height: 100%;">
							<table
								border="0"
								style="border-top: 0px solid;table-layout: fixed;border-collapse: collapse;border-bottom:0px solid;margin-top:0px"
								width="100%"
								height="100%"
								frame="void"
								cellspacing="0"
								cellpadding="0"
							>
								<tr>
									<td class="tdback" >问题位置</td>
									<td class="tdback" style="word-wrap:break-word;border-left:1px solid black">时间</td>
								</tr>
							</table>
						</td>
					</tr>
					<tr v-if="datalist.length < 1"><td colspan="6">暂无数据</td></tr>
					<tr v-if="datalist.length > 0" v-for="(item, index) in dataobject" :key="index">
						<td style="word-wrap:break-word;">{{ item[0].deptName }}</td>
						<td style="word-wrap:break-word;">{{ item[0].projectName }}</td>
						<td style="word-wrap:break-word;">{{ item[0].projectCode }}</td>
						<td style="word-wrap:break-word;">{{ item[0].sn }}</td>
						<td style="word-wrap:break-word;">{{ item[0].dealTimes }}</td>

						<td colspan="1" style="padding: 0;">
							<table
								border="0"
								style="border-top: 0px solid;table-layout: fixed;border-collapse: collapse;border-bottom:0px solid;margin-top:-1px"
								width="100%"
								height="100%"
								frame="void"
								cellspacing="0"
								cellpadding="0"
							>
								<tr
									:style="
										item.length - 1 == index1
											? 'border-right:0px solid;border-bottom:0px solid ;'
											: 'border-right:0px solid;border-bottom:1px solid black;'
									"
									v-for="(item1, index1) in item"
									:key="index1"
									:class="item1.errorAddress ? 'redcolor' : ''"
								>
									<td
										v-if="item1.errorAddress && item1.deal == true"
										:class="item1.errorFlag == true ? 'pink' : 'bluecolor'"
										style="word-wrap:break-word;border-left:1px solid black"
									>
										{{ item1.errorAddress }}
									</td>
									<td
										v-else
										:class="item1.errorAddress ? 'redcolor' : ''"
										style="word-wrap:break-word;border-left:1px solid black"
									>
										{{ item1.errorAddress }}
									</td>
									<td
										v-if="item1.errorAddress && item1.deal == true"
										:class="item1.errorFlag == true ? 'pink' : 'bluecolor'"
										style="border-left:1px solid black"
									>
										{{ item1.time }}
									</td>
									<td v-else style="border-left:1px solid black">
										{{ item1.time }}
									</td>
								</tr>
							</table>
						</td>
					</tr>
				</table>
			</view>
			<view style="height:20rpx"></view>
		</view>
	</view>
</template>

<script>
import { stateGather } from '@/api/index.js';
export default {
	onLoad(val) {
		this.id = val.id;
		uni.showLoading({
			title: '加载中'
		});
		this.timeone = val.timeone;
		this.hour = val.hour;
		this.minute = val.minute;
		this.second = val.second;
		this.hourarr = this.hour + ':' + this.minute + ':' + this.second;
	},
	onUnload() {
		plus.screen.lockOrientation('portrait-primary');
	},
	onBackPress(e) {
		if (e.from == 'backbutton') {
			uni.navigateTo({
				url: '../preview/blank'
			});
			return true;
		}
	},
	onShow() {
		plus.screen.lockOrientation('landscape-primary');
		switch (uni.getSystemInfoSync().platform) {
			case 'android':
				this.hanldeFont();
				break;
			case 'ios':
				this.hanldeFont();
				break;
			default:
				this.hanldeFonts();
				break;
		}
		this.getList();
		this.date = this.timeone;
		this.current = 0;
		uni.hideLoading();
	},
	onUnload() {
		plus.screen.lockOrientation('portrait-primary');
	},
	data() {
		return {
			date: '',
			datalist: [],
			hourarr: '',
			current: 0,
			dataobject: {}
		};
	},
	methods: {
		getList() {
			const data = {};
			stateGather(data).then(res => {
				this.datalist = res.rows;
				this.dataobject = {};
				if (this.datalist == undefined) {
					this.datalist = [];
				} else {
					for (var i in this.datalist) {
						if (i == this.datalist.length - 1) {
							const i2 = Number(i) + 1;
							const key =
								this.datalist[i].projectName +
								'-' +
								this.datalist[i].deptName +
								'-' +
								this.datalist[i].projectCode +
								'-' +
								this.datalist[i].sn;
							const list = 'datalist' + i;
							if (this.dataobject[key]) {
							} else {
								this.dataobject[key] = [];
							}
							this.dataobject[key].push(this.datalist[i]);
						} else {
							const i2 = Number(i) + 1;
							if (this.datalist[i].sn == this.datalist[i2].sn) {
								const key =
									this.datalist[i].projectName +
									'-' +
									this.datalist[i].deptName +
									'-' +
									this.datalist[i].projectCode +
									'-' +
									this.datalist[i].sn;
								const list = 'datalist' + i;
								if (this.dataobject[key]) {
								} else {
									this.dataobject[key] = [];
								}
								this.dataobject[key].push(this.datalist[i]);
							} else {
								const key =
									this.datalist[i].projectName +
									'-' +
									this.datalist[i].deptName +
									'-' +
									this.datalist[i].projectCode +
									'-' +
									this.datalist[i].sn;
								const list = 'datalist' + i;
								if (this.dataobject[key]) {
								} else {
									this.dataobject[key] = [];
								}
								this.dataobject[key].push(this.datalist[i]);
							}
						}
					}
				}
				uni.hideLoading();
			});
		},
		hanldeFont() {
		
		},
		hanldeFonts() {
			
		}
	}
};
</script>

<style lang="scss" scoped>
.tdback {
	background-color: #0070c0;
	color: white !important;
}
.pink {
	color: #de00ed;
}
/deep/ table {
	border-color: black;
}
.titleTd {
	td {
		color: #1040be;
		font-weight: 600;
	}
}
h3 {
	// font-family: sonti;
}
// view{
//    font-family: sonti;
// }
tr,
td {
	// font-family: FZFSJW;
	// font-family: sonti;
	// font-family: FangSong;
}
th {
	font-weight: 500;
}

uni-view {
	font-size: 14px;
}
.vtable {
	text-align: center;
	width: 100%;
	padding: 10rpx 20rpx 20rpx 20rpx;
}
thead {
	th {
		font-weight: 500;
		text-align: center;
	}
}
tbody {
	td {
		text-align: center;
	}
}
.flex {
	display: flex;
	justify-content: center;
}
.text-c {
	th {
		width: 400rpx;
	}
}
.title {
	width: 100%;
	display: flex;
	justify-content: space-between;
	view {
		width: 30%;
	}
	.span {
		height: 100%;
		border: 1px solid #333;
	}
	.text {
		display: flex;
		view {
			flex: 1;
		}
		uni-input {
			height: 100%;
			border-left: 1px solid;
			border-right: 1px solid;
		}
	}
}
.last {
	display: flex;
	view {
		flex: 1;
	}
}
.vtitle {
	font-weight: 600;
}
image {
	width: 50rpx;
	height: 50rpx;
}
.check {
	border-bottom: 2px solid #333;
	width: 105%;
	margin-right: 20px;
}
.talbeborder {
	border: 1px solid;
}
.titlechild {
}
.ttitle {
	font-size: 20px;
	font-weight: 600;
}
.date {
	z-index: 9999;
	position: absolute;
	top: -80rpx;
	right: 10rpx;
	margin-right: 10rpx;
	display: flex;
	align-items: center;
	.image {
		position: absolute;
		width: 28rpx;
		height: 34rpx;
		left: 20rpx;
		// height: 80upx;
	}
	/deep/ .u-size-default {
		padding: 18rpx 24rpx 18rpx 50rpx;
	}
	/deep/ .u-mode-plain-primary {
		border: 1px solid #eee;
		box-shadow: 0 0 20rpx #eee;
		border-radius: 16rpx;
		color: #989898;
	}
}
.ttitle1 {
	position: fixed;
	bottom: 0rpx;
}
.title2 {
	height: calc(100% - 140upx);
}
.k-line {
	display: lnline-block;
	width: 15px;
	height: 15px;
	border-radius: 15px;
	margin-top: 20px;
}
@keyframes k-loadingA {
	50% {
	}
}
.innerContain {
	height: 100%;
	text-align: center;
	position: relative;
	background-color: white;
}
.top-content {
	height: 360upx;
	// background: linear-gradient(to left, #1040be, #026dff);
}
.redcolor {
	color: red;
}
.bluecolor {
	color: blue;
}
.top {
	// height: calc(100% - 50rpx);
	margin: 0rpx;
	overflow-y: auto;
	position: absolute;
	background: rgb(244, 249, 250);
	// background-color: white;
	padding: 50rpx;
	width: 100%;
	// box-shadow: 4rpx 4rpx 20rpx #e5e1e1;
	top: 30rpx;
	border-radius: 40rpx 40rpx 0 0;
	.card {
		// background-color: white;
		border: 1px solid #eee;
		padding: 20rpx 20rpx;
		border-radius: 25rpx;
		box-shadow: 0 0 20rpx #eee;
		margin-bottom: 20rpx;
	}
}
/deep/ .uni-view {
	font-size: 0px;
}
.titlechild {
	margin-top: -10rpx;
}
/deep/ .u-line-1 {
	height: 60rpx !important;
}
.border {
	font-family: SimSun;
	margin-left: 20rpx;
	padding: 15rpx 5rpx;
	// box-shadow: 0 0 20rpx #eee;
	border: 1px solid rgb(180, 175, 175);
	border-radius: 16rpx;
	color: #eee;
}
/deep/ .video-del {
	display: none;
}
/deep/ .u-scroll-box {
	font-family: SimSun;
}
/deep/ .u-drawer-content-visible {
	height: 80% !important;
}
</style>
